<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta content="yes" name="apple-mobile-web-app-capable">
<meta content="black" name="apple-mobile-web-app-status-bar-style">
<meta content="telephone=no" name="format-detection">
<meta name="description" content="">
<meta name="keywords" content="">

<title>海风商城</title>
<link rel="stylesheet" href="/css/base.css"/>
<link rel="stylesheet" href="/css/index.css"/>
<link rel="shortcut icon" href="favicon.ico" />
{insert_scripts files="../../js/jquery-1.12.3.min.js"}
{insert_scripts files="../../js/swiper.min.js"}
<script>
      var iScale = 1;
        !function(){
            var htmlEl = document.getElementsByTagName('html')[0];
            var fitPage = function(){
                /* The calculate of with from zepto  */
                var w = htmlEl.getBoundingClientRect().width;
                w = Math.round(w);
                w = w > 640 ? 640: w;
                var newW = w/640 * 100;
                htmlEl.style.fontSize = newW + 'px';
            }
            fitPage();
            var t;
            var func = function(){
                clearTimeout(t);
                t = setTimeout(fitPage, 25);
            }
            window.addEventListener('resize', func);
        }();
    </script>
</head>
<body>

<!--banner Start-->
<div class="wrapper">
  <div class="pay-order">
    <!--header Start-->
    <div class="header ">
      <div class="left fl">
        <a onclick="history.go(-1)" class="home">
        <img src="/images/hf/icon_back_n.png" class="ib">
        <i></i>
        </a>
      </div>
      <div class="tit">
        <h2><span class="title">订单支付</span></h2>
      </div>
      <div class="right fr">
      </div>
    </div>
    <!--header End  -->
    <div class="pay-title ">
      <div class="item">
        支付单号：{$order.order_sn}
      </div>
      <div class="item">
        应付金额：
        <span class="price">￥{$order.order_amount}</span>
      </div>
    </div>
    <div class="ui_pay ">
      信用卡分期
    </div>
    <div class=" bank-list">
      <ul class="clearfix payment-list ">
        <li class="on"><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
        <li><img src="/images/hf/payOnline_zsyh.png" alt=""></li>
      </ul>
      <p>
        选择期数
      </p>
      <div class="card-nav">
        <ul class="hd">
          <li class="card-item curr">3期<b></b></li>
          <li class="card-item ">6期<b></b></li>
          <li class="card-item ">12期<b></b></li>
          <li class="card-item ">24期<b></b></li>
        </ul>
        <div class="card-box clearfix" style="display:block">
          <p>
            应付款金额：<span class="col-red">7301.67</span>元,含手续费<span class="col-red">212.67</span>元
          </p>
          <p>
            （分期手续费<span class="col-red">212.67</span>元将由海风教育为您支付）
          </p>
          <p>
            现付款金额：<span class="col-red">7089.00</span>元
          </p>
          <p>
            首期还款：<span class="col-red">2575.67</span>元
          </p>
        </div>
        <div class="card-box clearfix">
          <p>
            应付款金额2：<span class="col-red">7301.67</span>元,含手续费<span class="col-red">212.67</span>元
          </p>
          <p>
            （分期手续费<span class="col-red">212.67</span>元将由海风教育为您支付）
          </p>
          <p>
            现付款金额：<span class="col-red">7089.00</span>元
          </p>
          <p>
            首期还款：<span class="col-red">2575.67</span>元
          </p>
        </div>
        <div class="card-box clearfix">
          <p>
            应付款金额3：<span class="col-red">7301.67</span>元,含手续费<span class="col-red">212.67</span>元
          </p>
          <p>
            （分期手续费<span class="col-red">212.67</span>元将由海风教育为您支付）
          </p>
          <p>
            现付款金额：<span class="col-red">7089.00</span>元
          </p>
          <p>
            首期还款：<span class="col-red">2575.67</span>元
          </p>
        </div>
        <div class="card-box clearfix">
          <p>
            应付款金额4：<span class="col-red">7301.67</span>元,含手续费<span class="col-red">212.67</span>元
          </p>
          <p>
            （分期手续费<span class="col-red">212.67</span>元将由海风教育为您支付）
          </p>
          <p>
            现付款金额：<span class="col-red">7089.00</span>元
          </p>
          <p>
            首期还款：<span class="col-red">2575.67</span>元
          </p>
        </div>
        <div>
        </div>
      </div>
    </div>
    <script>
        $(function  () {
            $(".card-item").click(function(event) {
                $(this).addClass("curr").siblings().removeClass("curr")
                var $key=$(this).index();
                $(this).parent(".hd").siblings(".card-box").eq($key).show().siblings(".card-box").hide();
            })
        })
    </script>
    <div class="ui_pay ">
      其他支付
    </div>
    <div class="order-list ">
      <div class="item">
        <strong>快捷支付</strong>
        <em></em>
        <span>海风教育免费为您支付“分期付款手续费” </span>
        <i class="more"></i>
      </div>
      <div class="item">
        <strong>网银支付</strong>
        <span>大额支付更安全</span>
        <i class="more"></i>
      </div>
      <div class="item">
        <strong>支付宝</strong>
        <span></span>
        <i class="more"></i>
      </div>
      <div class="item">
        <strong>微信支付</strong>
        <span></span>
        <i class="more"></i>
      </div>
    </div>
    <div class="ui_line">
    </div>
    <div class="product-footer">
      <div class="btns-box clearfix">
        <div class="fprice fl">
          <span>应付金额：</span><strong>1099元</strong>
        </div>
        <a href="javascript:;" class="btns fr">立即支付</a>
      </div>
    </div>
  </div>
</div>

</body>
</html>